import React, { Component } from 'react'
import {connect} from "react-redux";
import {bindActionCreators} from "redux";
import Header from '../../components/Header/Header'
import { List,Tabs } from 'antd-mobile'
import './Coupon.less'
import {filterTime} from "../../filters/index"
import { actions,getCou } from '../../store/modules/Coupon';

class Coupon extends Component {
    componentDidMount(){
        let {coupon:{requestcoupons}}=this.props;
        requestcoupons();
    }
    render() {
        let titles=['未使用','已使用','已过期']
        let {coupons}=this.props
        return (
            <div>
                <Header title="优惠券" back></Header>
                <div className="coupon">
                    <Tabs>
                        {
                            coupons.map((item,ind)=>(
                                <Tabs.Tab title={titles[ind]} key={ind}>
                                    {
                                        item.content.map(item=>(
                                            <List.Item key={item.id}>
                                                <h3>{item.money}</h3>
                                                <div>{item.title}</div>
                                                <p>{item.description}</p>
                                                <p>有效时间：{item.begintime?filterTime(item.begintime):null}</p>
                                                <p>失效时间：{item.endtime?filterTime(item.endtime):null}</p>
                                            </List.Item>                                       
                                        ))
                                    }

                                </Tabs.Tab>
                            ))
                        }
                    </Tabs>
                </div>
            </div>
        )
    }
}

//取数据
const mapStateToProps = (state) => {
    return {
        coupons:getCou(state)
    };
}

//取方法
const mapDispatchToProps = (dispatch) =>{
    return {
        coupon:bindActionCreators(actions,dispatch)
    };
}

export default connect(mapStateToProps,mapDispatchToProps)(Coupon)